En QML javascript, cuando se ejecuta un constructor de clase de javascript puro, "esto" se vuelve momentáneamente indefinido en el código bajo if (cond) { ... } pero por lo demás es válido como debería ser.
Este problema (aparentemente) ocurre solo si el código está en el cuerpo de una función de flecha anónima. Las funciones de flecha de JS no proporcionan "esto" ni hacen nada con él, por lo que this símbolo debe hacer referencia a su definición en el ámbito adjunto, es decir, el constructor de la clase; y lo es, excepto en if (c) {...} condicionales!
¿Qué puede explicar esto?
import QtQuick 2.14 Item { Component.onCompleted: { class Bugtest { constructor() { this.foo = 123; ((arg) => { print("BEFORE if: this="+this+", foo="+this.foo); if (true) { print("DURING if: this="+this); //undefined here only!! } print("AFTER if: this="+this+", foo="+this.foo); })(42); print("At constructor exit: this="+this+", foo="+this.foo); } }; var xyz = new Bugtest(); } }Ejecutar lo anterior con qml (o qmlscene ) v6.2.1 o v5.15.2 produce:
qml: BEFORE if: this=[object Object], foo=123 qml: DURING if: this=undefined qml: AFTER if: this=[object Object], foo=123 qml: At constructor exit: this=[object Object], foo=123Esto parece un error de QML en el que se rompe el alcance del enlace "este". Si bien no puedo explicar por qué sería esto, encontré una solución alternativa, donde explícitamente .bind(this) antes de ingresar a la función, lo que hace que el contenido de if conditional se evalúe correctamente:
import QtQuick 2.15 Item { Component.onCompleted: { class Bugtest { constructor() { this.foo = 123; ((arg) => { console.log("BEFORE if: this="+this+", foo="+this.foo); if (true) { console.log("DURING if: this="+this+", foo="+this.foo); // now works in QML and JSFiddle } console.log("AFTER if: this="+this+", foo="+this.foo); }).bind(this)(42); // added explicit 'this' bind here console.log("At constructor exit: this="+this+", foo="+this.foo); } }; var xyz = new Bugtest(); } }